html {
  height: 100%;
}

body {
  position: relative;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.app {
  $solidBorder: 1px solid #eee;
  $sideCollapsedWidth: 66px;
  $sideExpandedWidth: 230px;
  font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
  font-size: 1em;
  width: 100%;
  height: 100%;
  min-width: 900px;
  border: $solidBorder;
  display: flex;
  display: -webkit-flex;
  flex-flow: row nowrap;
&-side {
   width: 230px;
   height: 100%;
   font-weight: 700;
   border-right: $solidBorder;
&-left {
   background-color: rgb(238, 241, 246);
 }
&-logo {
   height: 60px;
   text-align: center;
 }
&-collapsed {
   width: 66px!important;
 }
&-expanded {
   width: 230px!important;
 }
}
&-header {
   width: 100%;
   height: 60px;
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   align-items: center;
   border-bottom: $solidBorder;
&-userinfo {
   position: absolute;
   right: 0;
   margin-right: 25px;
   display: flex;
   flex-flow: row nowrap;
   height: 60px;
   justify-content: flex-start;
   align-items: center;
 }
}
&-body {
   font-size: 1em;
   width: 100%;
   height: 100%;
   padding: 20px;
   overflow-y: scroll;
 }
&-footer {
   width: 100%;
   height: 60px;
 }
}

.inline-block {
  display: inline-block;
}
